<template>
  <j-modal
    title="初步研判"
    :width="1100"
    :visible="visible"
    switchFullscreen
    :okButtonProps="{ class: { 'jee-hidden': disableSubmit } }"
    @cancel="handleCancel"
    @ok="handleOk"
  >
    <div class="con-content">
      <a-row style="margin-bottom:10px;">
        <a-col :span="6">
          <span>模型名称：</span><span style="color:red;">{{ modelName }}</span>
        </a-col>
        <a-col :span="15">
          <span>情报更新时间：</span><span>{{ baseInfo.updateTime }}</span>
        </a-col>
        <a-col> <a-button type="primary" @click="onAdd()">发起案事件</a-button> </a-col>
      </a-row>
      <CustomTable
        ref="table"
        :showAlert="false"
        :columns="columns1"
        :dataSource="pageData1"
        :showSelection="false"
        :showPagination="true"
        rowKey="id"
        @change="onTableChange1"
      >
        <template slot="phoneNumber" slot-scope="text, record">
          <!-- {{record.isSamplePerson}} -->
          <span
            >{{ text }}
            <a-tag v-if="record.isSamplePerson" style="margin-left:20px;" color="red">负样本人员</a-tag></span
          >
        </template>
      </CustomTable>
      <div style="position: relative;z-index: 100;">
        <a-button @click="onLatestLocation()" :loading="btnLoading" style="position: absolute;right: 15px;"
          >获取位置</a-button
        >
      </div>
      <a-tabs>
        <a-tab-pane key="1" tab="情报号码基本信息">
          <a-row style="margin-bottom:10px;">
            <a-col :span="12">
              <span>手机号码：</span><span>{{ baseInfo.phone }}（{{ baseInfo.phoneArea }})</span>
            </a-col>
            <a-col :span="6">
              <span>姓名/代号：</span><span>{{ baseInfo.name }}</span>
            </a-col>
            <a-col :span="6">
              <span>命中时间：</span><span style="color:red;">{{ baseInfo.hitTime }}</span>
            </a-col>
          </a-row>
          <a-row style="margin-bottom:10px;">
            <a-col :span="24">
              <span>命中规则：</span>
              <span style="color:red;" v-if="modelId == '11'">
                时间段在 {{ form1.startPeriod }} - {{ form1.endPeriod }}且{{ form1.day }}天内与种子号码通联过{{
                  form1.time
                }}次的人员；时间段在{{ form1.networkStartPeriod }} -
                {{ form1.networkEndPeriod }}与种子号码通联，且手机网络制式为{{ form1.network }}的人员；
              </span>
              <span style="color:red;" v-if="modelId == '12'">
                时间范围在距今{{ form2.day }}天内，且属于种子号码在{{ form2.min }}分钟内通联了{{
                  form2.num
                }}个以上号码中的其中之一；时间范围在距今{{ form2.msgDay }}天内收到种子号码的群发短信；
              </span>
              <span style="color:red;" v-if="modelId == '13'">
                固定在每天{{ form3.startPeriod }}至{{ form3.endPeriod }}的时间内与种子号码进行通联，超过{{
                  form3.day
                }}天
              </span>
              <span style="color:red;" v-if="modelId == '14'">
                在{{ form4.day }}天内，每天转账超过{{ form4.num }}次；在{{ form4.transferDay }}天内，转账金额在{{
                  form4.transferLevel
                }}等级以上的次数超过{{ form4.transferNum }}次；
              </span>
            </a-col>
          </a-row>
          <a-row v-if="latestLocation != null && latestLocation != ''">
            <span>最新位置：</span>
            <span>{{ latestLocation }}</span>
          </a-row>
        </a-tab-pane>
        <a-tab-pane key="2" tab="模型规则" force-render>
          <a-form-model ref="ruleForm1" v-if="modelId == '11'">
            <a-form-model-item>
              时间段在
              <a-input class="input" v-model="form1.startPeriod" :disabled="true" style="margin-left: 0;" /> 点至
              <a-input class="input" v-model="form1.endPeriod" :disabled="true" />点，且近
              <a-input class="input" v-model.number="form1.day" :disabled="true" style="margin-left: 0;" />
              天内与种子号码通联超过
              <a-input class="input" v-model.number="form1.time" :disabled="true" style="margin-left: 0;" /> 次的人员
            </a-form-model-item>
            <a-form-model-item>
              时间段在
              <a-input class="input" v-model="form1.networkStartPeriod" :disabled="true" style="margin-left: 0;" /> 点至
              <a-input
                class="input"
                v-model="form1.networkEndPeriod"
                :disabled="true"
              />点与种子号码通联，且手机网络制式为
              <a-input class="input" v-model="form1.network" :disabled="true" />的人员
            </a-form-model-item>
          </a-form-model>
          <a-form-model ref="ruleForm2" v-if="modelId == '12'">
            <a-form-model-item>
              时间范围在距今
              <a-input class="input" v-model.number="form2.day" :disabled="true" style="margin-left: 0;" />
              天内，种子号码在任意 <a-input class="input" v-model.number="form2.min" :disabled="true" />分钟内，通联
              <a-input class="input" v-model="form2.num" :disabled="true" style="margin-left: 0;" /> 个以上的号码
            </a-form-model-item>
            <a-form-model-item>
              时间范围在距今
              <a-input class="input" v-model="form2.msgDay" :disabled="true" style="margin-left: 0;" />
              天内，收到种子号码的群发短信
            </a-form-model-item>
          </a-form-model>
          <a-form-model ref="ruleForm3" v-if="modelId == '13'">
            <a-form-model-item>
              时间段在
              <a-input class="input" v-model="form3.startPeriod" :disabled="true" style="margin-left: 0;" /> 点至
              <a-input class="input" v-model="form3.endPeriod" :disabled="true" />点，且近
              <a-input class="input" v-model.number="form3.day" :disabled="true" style="margin-left: 0;" />
              天内与种子号码通联大于
              <a-input class="input" v-model.number="form3.num" :disabled="true" style="margin-left: 0;" /> 次的人员
            </a-form-model-item>
          </a-form-model>
          <a-form-model ref="ruleForm4" v-if="modelId == '14'">
            <a-form-model-item>
              在
              <a-input class="input" v-model.number="form4.day" :disabled="true" style="margin-left: 0;" />
              天内，每天转账次数大于 <a-input class="input" v-model.number="form4.num" :disabled="true" />次的人员
            </a-form-model-item>
            <a-form-model-item>
              在
              <a-input class="input" v-model.number="form4.transferDay" :disabled="true" style="margin-left: 0;" />
              天内，转账金额在
              <a-input
                class="input"
                v-model.number="form4.transferLevel"
                :disabled="true"
                style="margin-left: 0;"
              />等级以上的行为超过 <a-input class="input" v-model.number="form4.transferNum" :disabled="true" />次的人员
            </a-form-model-item>
          </a-form-model>
        </a-tab-pane>
      </a-tabs>
      <a-tabs>
        <a-tab-pane key="1" :tab="tabTitle">
          <CustomTable
            ref="table"
            :showAlert="false"
            :columns="columns2"
            :dataSource="pageData2"
            :showSelection="false"
            :showPagination="true"
            :loading="loading2"
            rowKey="id"
            @change="onTableChange2"
          >
            <template slot="errorStatus" slot-scope="text">
              <span class="text_color_1" v-if="text == '1'">全部</span>
              <span class="text_color_3" v-if="text == '2'">匹配通话</span>
              <span class="text_color_2" v-if="text == '3'">匹配网络</span>
            </template>
            <template slot="relationType" slot-scope="text">
              <span class="text_color_1" v-if="text == '1'">通话</span>
              <span class="text_color_3" v-if="text == '2'">短信</span>
            </template>
            <template slot="phone" slot-scope="text, record">
              <!-- {{record.isSamplePerson}} -->
              <span
                >{{ text }}
                <a-tag v-if="record.isSamplePerson" style="margin-left:20px;" color="red">负样本人员</a-tag></span
              >
            </template>
          </CustomTable>
        </a-tab-pane>
        <a-tab-pane key="2" tab="通联关系图" force-render v-if="modelId == '11'">
          <chartYBar :data="relationData" />
        </a-tab-pane>
      </a-tabs>
      <!--情报模块进入 -->
      <!--页面来源pageType， 1：案事件管理 2：任务情报列表 3： 配置情报列表 4： 重点人列表 5：任务情报管理 6：种子号码列表 7：协查函列表、8 审批列表   10 负样本人员库 11 时空碰撞 -->
      <AddCaseModal
        ref="addCaseModalId"
        :pageType="2"
        :targetData="[{ id: baseInfo.id, phone: baseInfo.phone, name: baseInfo.name }]"
        moduleType="intelligence"
      />
    </div>
  </j-modal>
</template>

<script>
import * as api from '@/api/wxSmuggle/intelligence.js'
import * as modelApi from '@/api/wxSmuggle/eventModel.js'
import CustomTable from '@/components/zxd/Table/CustomTable'
import chartYBar from './chart-y-bar'
import AddCaseModal from '@/views/wxSmuggle/modules/AddCaseModal'
import { querySimpleByPhoneList } from '@/utils/util'
export default {
  name: 'ypModal',
  components: { CustomTable, chartYBar, AddCaseModal },
  props: [],
  data() {
    return {
      width: 1100,
      visible: false,
      disableSubmit: false,
      pageData1: {},
      pageData2: {},
      recordData: {},
      // modelCheck: false,
      columns1: [
        {
          title: '序号',
          dataIndex: 'order',
          width: 200,
          align: 'center',
          customRender: (text, record, index) => `${(this.pageData1.current - 1) * this.pageData1.size + (index + 1)}` //序号分页后连续
        },
        {
          title: '种子号码',
          dataIndex: 'phoneNumber',
          align: 'left',
          width: 300,
          scopedSlots: { customRender: 'phoneNumber' }
        },
        {
          title: '姓名',
          dataIndex: 'userName',
          align: 'center',
          scopedSlots: { customRender: 'userName' }
        }
      ],
      columns2: [],
      columns21: [
        {
          title: '序号',
          dataIndex: 'order',
          width: 120,
          align: 'center',
          customRender: (text, record, index) => `${(this.pageData2.current - 1) * this.pageData2.size + (index + 1)}` //序号分页后连续
        },
        {
          title: '对端种子号码',
          dataIndex: 'phone',
          align: 'left',
          scopedSlots: { customRender: 'phone' }
        },
        {
          title: '种子号码群组',
          dataIndex: 'groupId',
          align: 'center',
          scopedSlots: { customRender: 'groupId' }
        },
        {
          title: '通联时间',
          dataIndex: 'relationTime',
          align: 'center',
          scopedSlots: { customRender: 'relationTime' }
        },
        {
          title: '本端网络制式',
          dataIndex: 'network',
          align: 'center',
          scopedSlots: { customRender: 'network' }
        },
        {
          title: '异常状态',
          dataIndex: 'errorStatus',
          align: 'center',
          scopedSlots: { customRender: 'errorStatus' }
        }
      ],
      columns22: [
        {
          title: '序号',
          dataIndex: 'order',
          width: 120,
          align: 'center',
          customRender: (text, record, index) => `${(this.pageData2.current - 1) * this.pageData2.size + (index + 1)}` //序号分页后连续
        },
        {
          title: '对端种子号码',
          dataIndex: 'phone',
          align: 'left',
          scopedSlots: { customRender: 'phone' }
        },
        {
          title: '种子号码群组',
          dataIndex: 'groupId',
          align: 'center',
          scopedSlots: { customRender: 'groupId' }
        },
        {
          title: '通联类型',
          dataIndex: 'relationType',
          align: 'center',
          scopedSlots: { customRender: 'relationType' }
        },
        {
          title: '通联时间',
          dataIndex: 'relationTime',
          align: 'center',
          scopedSlots: { customRender: 'relationTime' }
        },
        {
          title: '异常状态',
          dataIndex: 'errorStatus',
          align: 'center',
          scopedSlots: { customRender: 'errorStatus' }
        }
      ],
      columns23: [
        {
          title: '序号',
          dataIndex: 'order',
          width: 120,
          align: 'center',
          customRender: (text, record, index) => `${(this.pageData2.current - 1) * this.pageData2.size + (index + 1)}` //序号分页后连续
        },
        {
          title: '对端种子号码',
          dataIndex: 'phone',
          align: 'left',
          scopedSlots: { customRender: 'phone' }
        },
        {
          title: '种子号码群组',
          dataIndex: 'groupId',
          align: 'center',
          scopedSlots: { customRender: 'groupId' }
        },
        {
          title: '通联时间',
          dataIndex: 'relationTime',
          align: 'center',
          scopedSlots: { customRender: 'relationTime' }
        },
        {
          title: '异常状态',
          dataIndex: 'errorStatus',
          align: 'center',
          scopedSlots: { customRender: 'errorStatus' }
        }
      ],
      columns24: [
        {
          title: '序号',
          dataIndex: 'order',
          width: 80,
          align: 'center',
          customRender: (text, record, index) => `${(this.pageData2.current - 1) * this.pageData2.size + (index + 1)}` //序号分页后连续
        },
        {
          title: '转入/转出类型',
          dataIndex: 'transferCategory',
          align: 'center',
          scopedSlots: { customRender: 'transferCategory' }
        },
        {
          title: '转账金额类别',
          dataIndex: 'transferType',
          align: 'center',
          scopedSlots: { customRender: 'transferType' }
        },
        {
          title: '转账时间',
          dataIndex: 'transferTime',
          align: 'center',
          scopedSlots: { customRender: 'transferTime' }
        }
      ],
      form1: {},
      form2: {},
      form3: {},
      form4: {},
      submitLoading: false,
      relationData: [],
      loading2: false,
      pageFilter2: {
        pageNo: 1,
        pageSize: 5
      },
      baseInfo: {},
      modelId: '11',
      modelName: '',
      tabTitle: '通话详情',
      latestLocation: '',
      btnLoading: false,
      pTimer: 0
    }
  },
  created() {},
  methods: {
    show(record) {
      this.visible = true
      this.current = 0
      this.pageFilter2.id = record.id
      this.modelId = record.modelId
      this.modelName = record.modelName
      console.log('modelId')
      console.log(this.modelId)
      if (this.modelId == '11') {
        this.columns2 = this.columns21
        this.tabTitle = '通话详情'
      }
      if (this.modelId == '12') {
        this.columns2 = this.columns22
        this.tabTitle = '文本/通话详情'
      }
      if (this.modelId == '13') {
        this.columns2 = this.columns23
        this.tabTitle = '通话详情'
      }
      if (this.modelId == '14') {
        this.columns2 = this.columns24
        this.tabTitle = '详情'
      }
      this.refreshTable2()
    },
    refreshTable2() {
      this.loading2 = true
      api
        .intelligenceDetail(this.pageFilter2)
        .then(res => {
          if (res.success) {
            this.loading2 = false
            this.baseInfo = res.result.clearIntelligenceDTO //明文情报基础信息
            this.pageData2 = res.result.clearIntelligenceRelationDTOList //详情列表
            //判断是否是负样本号码，并添加负样本标签(电话号码字段：phoneNumber传1，phone传2，msisdn传3)
            querySimpleByPhoneList(this, 2, this.pageData2.records)
            // console.log(this.pageData1)
            if (this.modelId == '11') {
              this.form1 = res.result.clearIntelligenceConfigDTO.phoneModelDTO //作案手机模型
            }
            if (this.modelId == '12') {
              this.form2 = res.result.clearIntelligenceConfigDTO.wadeModelDTO //涉走私水客群体挖掘模型
            }
            if (this.modelId == '13') {
              this.form3 = res.result.clearIntelligenceConfigDTO.exceptionRelationModelDTO //异常通联行为发现模型
            }
            if (this.modelId == '14') {
              this.form4 = res.result.clearIntelligenceConfigDTO.exceptionTradeModelDTO //异常资金往来挖掘
            }
            //通联关系图
            this.getRelationDataData(res.result.labelValueDTOList)
            //种子号码列表
            this.recordData = res.result.incidentTaskUserList //	种子号码列表
            this.refreshTable1(1)
            this.onPosition() //最新位置信息
          } else {
            this.loading2 = false
          }
        })
        .catch(e => {
          this.loading2 = false
          this.$message.warn('请求失败！')
        })
    },
    //种子号码列表，前端分页
    refreshTable1(current) {
      this.pageData1 = {
        current: current,
        pages: parseInt((this.recordData.length - 1) / 5) + 1,
        size: 5,
        records: this.recordData,
        total: this.recordData.length
      }
      //判断是否是负样本号码，并添加负样本标签(电话号码字段：phoneNumber传1，phone传2，msisdn传3)
      querySimpleByPhoneList(this, 1, this.pageData1.records)
      // console.log(this.pageData1)
    },
    onTableChange1(pagination, pageFilter, sorter) {
      this.refreshTable1(pagination.currentPage)
    },
    onTableChange2(pagination, pageFilter, sorter) {
      let keyMap = { currentPage: 'pageNo' }
      let paginations = Object.keys(pagination).reduce((newData, key) => {
        let newKey = keyMap[key] || key
        newData[newKey] = pagination[key]
        return newData
      }, {})
      this.pageFilter2 = Object.assign({}, this.pageFilter2, paginations)
      this.refreshTable2()
    },
    onAdd() {
      //此处目标人是情报号码基本信息里的号码，只有一个号码
      this.$refs.addCaseModalId.show()
    },
    //下发大数据查最新位置
    onLatestLocation() {
      this.btnLoading = true
      let params = {
        phone: [this.baseInfo.phone],
        taskNum: this.baseInfo.taskId,
        pageType: 2
      }
      modelApi.queryRealTimeTrajectory(params).then(res => {
        if (res.success) {
          let _this = this
          this.pTimer = setInterval(() => {
            _this.onPosition()
          }, 5000) //5秒查一下
          this.$message.success(res.message)
        }
      })
    },
    //获取最新位置
    onPosition() {
      api.getRealTimeLocation({ phone: this.baseInfo.phone }).then(res => {
        if (res.success) {
          this.latestLocation = res.result
          if (this.latestLocation != null && this.latestLocation != '') {
            this.btnLoading = false
            clearInterval(this.pTimer) //清理定时任务
          }
        }
      })
    },
    getRelationDataData(dataArr) {
      let data = []
      // let dataArr = [
      //   { label: '1888841888888', value: 365, radio: 25.76 },
      //   { label: '18888888888', value: 357, radio: 25.19 },
      //   { label: '1888885588888', value: 351, radio: 24.77 },
      //   { label: '1888887388888', value: 344, radio: 24.28 },
      //   { label: '188888088888', value: 244, radio: 24.28 }
      // ]
      if (dataArr != null && dataArr.length > 0) {
        let result = this.arrSort(dataArr, 'value') //排序
        data = result
          .map((item, index) => {
            if (index < 5) {
              //只取前五的数组值
              return {
                product: item.label,
                count: item.value
              }
            }
          })
          .filter(obj => obj !== undefined)
        this.relationData = data
      }
    },
    /**
     * 自定义函数名：arrSort
     * @param arr： 被操作数
     * @param key： 需要用作排序的key名
     */
    arrSort(arr, key) {
      arr.sort(function(a, b) {
        return b[key] - a[key]
      })
      return arr
    },
    handleCancel() {
      if (this.pTimer > 0) {
        this.btnLoading = false
        clearInterval(this.pTimer) //清理定时任务
      }
      this.visible = false
    },
    handleOk() {
      this.visible = false
    }
  }
}
</script>
<style lang="less" scoped>
.con-content {
  .con-content-top {
    width: 80%;
    margin: 10px auto 50px auto;
  }
  // padding-bottom: 50px;
}
.footerBox {
  display: flex;
  justify-content: flex-end;
  width: 100%;
  padding-top: 20px;
  border-top: 1px solid #ccc;
}
.input {
  width: 90px;
  margin: 0 6px;
}
/deep/.ant-col-15 {
  width: 65%;
}
/deep/.ant-pagination-options-size-changer.ant-select {
  display: none;
}
</style>
